<template>
	<div class="approvalView" v-if="shows">
		<van-pull-refresh v-model="isLoading" @refresh="onRefresh">
			<van-list v-model="loading" :style="{height:refreshHeight}" ref="list4" :finished="finished" finished-text="没有更多了" @load="onLoad" :immediate-check='false'>
				<ul class="list">
					<van-swipe-cell v-for="item in fromDataList" :disabled="item.system_handle_status !== '已撤消'" :before-close="beforeClose">
						<li @click="goPush(item.form_big_id,item.num)">
							<div class="list-box1">
								<div class="list_title">{{item.workflow_name}}{{item.num}}</div>
								<div :style="textColor(item.system_handle_status)" class="colors">
								<van-icon :name="imgSrc(item.system_handle_status)" />
								
								{{item.system_handle_status}}</div>
							</div>
							<div class="list-box2">
								<div class="list-title-min time">{{item.commit_time}}</div>
								<!-- <div class="list-title-min work-flow">编号:{{item.num}}</div> -->
							</div>
						</li>
						<template #right>
							<van-button @click="edit(item.form_big_id,item.num,item.workflow_name,'esc')" square type="primary" text="修改"/>
							<van-button @click="delet(item.form_big_id,item.num)" square type="danger" text="删除"/>			
						</template>
					</van-swipe-cell>
				</ul>
			</van-list>
		</van-pull-refresh>
	</div>
</template>

<script>
	import { approvalList } from '@assets/js/mixins/approvalList.js'
	import {getForm2} from '@request/api.js'
	import { swipeCell } from '@assets/js/mixins/swipeCell.js'
	import { pHeight } from '@assets/js/height.js'
	export default {
		mixins: [approvalList,swipeCell],
		data() {
			return {
				fromDataList:[],
				downLoad:true,
				loading:false,
				finished:false,
				isLoading:false,
				stop:true,
				refreshHeight:'auto',
				shows:true,
				obj:{
					'_page':1,
					'_pagesize':20,
					'_url': 'apply2',
					'party':this.$store.state.third_name
				}
			}
		},
		// beforeRouteEnter(to, from, next) {
		// 	if(from.name === 'approval' || from.name === 'apply' || from.name === 'home' || from.name === 'approvalInput'){		
		// 		next(vm => {
		// 		     vm.getList()
		// 		  })
		// 	}else{
		// 		next(vm => {
		// 			vm.$nextTick(()=>{
		// 				vm.$refs.list4.scroller.scrollTop = vm.$store.state.carrerTouScroll.height4
		// 			})				     
		// 		  })			
		// 	}
		// 	next()
		// },
		// beforeRouteLeave(to, from, next) { 		
		// 	if (to.name === 'approvalDetails') {
		// 		let scrollTop = this.$refs.list4.scroller.scrollTop
		// 		this.$store.commit('setCarrerTouScroll4', scrollTop)
		// 	} else {
		// 		this.$store.commit('setCarrerTouScroll4', 0)				
		// 	}
		// 	next()
		// },
		methods:{
			onLoad(){
				setTimeout(()=>{
					if(this.stop && this.downLoad){
						this.upList()
						this.stop = false
					}			
				},500)
			},
			upList(){
				  this.obj._page++
				　getForm2(this.obj).then(res=>{
						if(res.code == 0){
							res.data.forEach(item =>{
							  this.fromDataList.push(item)
							})
							// 加载状态结束
							this.loading = false;
							this.stop = true					
							if (this.fromDataList.length >= res.total) {
							    this.finished = true;	
								return false
							}
						}				
					})　				
			},
			onRefresh(){
				this.downLoad = false
				this.obj._page = 1
				this.finished = false
				setTimeout(()=>{
					this.getList()
				},500)
			},
			getList(){
				getForm2(this.obj).then(res=>{
					// console.log(res)
					if(res.code == 0){
						this.fromDataList = res.data	
						// list高度
						if(this.$refs.list4){
							this.$nextTick(()=>{
								let refresh = this.$refs.list4.$el.offsetHeight						
								const val = pHeight(refresh)
								if(val !== 'kong'){
									this.refreshHeight = val+'px'
								}else{
									this.shows =false
									this.refreshHeight = 'atuo'
									setTimeout(()=>{
										this.shows =true
									},0)
								}
							})	
						}				
						// 加载状态结束
						this.isLoading = false;
						this.downLoad = true
						if (this.fromDataList.length >= res.total) {
						  this.finished = true;		
						  return false
						}
					}				
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.list-box2 {
		display: flex;
		flex-direction: row-reverse;
	}
	.imgs {
		position: relative;
		top: vw(2);
		width: vw(16);
		height: vw(16);
		margin-right: vw(4);
	}
	.van-button{
		height: 100%;
	}
	@import '@assets/css/commont.scss'
</style>
